<!DOCTYPE html>
<html>
{% load staticfiles %}
<head>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
    <title>{% block title %}个人信息{% endblock %}</title>
    <link rel="stylesheet" type="text/css" href="{% static 'css/reset/reset.css' %}">
    <link rel="stylesheet" type="text/css" href="{% static 'css/reset/animate.css' %}">
    <link rel="stylesheet" type="text/css" href="{% static 'css/reset/style.css' %}">
    <link rel="stylesheet" type="text/css" href="{% static 'css/ncss.css' %}">
    {% block custom_css %}
    {% endblock %}
    <script src="{% static 'js/jquery/jquery.min.js' %}" type="text/javascript"></script>
    <script src="{% static 'js/jquery/jquery-migrate-1.2.1.min.js' %}" type="text/javascript"></script>

</head>
<body>
<div class="all_page_head">
    <div class="wp">
        <div class="all_page_head_message clearfix" style="height: 72px;width: 100%;">
            <a href="{% url 'index' %}"><img src="{% static 'images/logo_11261.png' %}" alt="" style="height: 72px" class="fl"></a>
            <div class="go_url_box fl" style="height: 72px;width: 300px;">
                <a href="{% url 'index' %}"><div class="url_div_box fl" style="text-indent: 30px">首页</div></a>
                <a href="{% url 'course:list' %}"><div class="url_div_box fl">课程</div></a>
                <a href="{% url 'course:list' %}?sort=price"><div class="url_div_box fl">付费课程</div></a>
                <a href="{% url 'org:teachers' %}"><div class="url_div_box fl">教师</div></a>
            </div>
            <div class="search_text fl">
                <span class="selectOption" id="jsSelectOption" data-value="{% if s_type %}{{ s_type }}{% else %}course{% endif %}" style="display: none;">
                                {% if s_type == 'course' %}公开课{% endif %}
                </span>
                <input id="search_keywords" class="search_keywords_textarea" type="text" value="{{ keywords }}" placeholder="搜索您想要的课程"/>
                <div class="search_keywords_btn" id="jsSearchBtn">Search</div>
            </div>
            <div class="my_img_course fl">
                {% if user.is_authenticated %}
                <div class="if_user_auth">
                    <div class="fl"><a href="{% url 'users:mycourse' %}"><div class="enter_my_course_center">我的课程</div></a></div>
                    <div class="user_auth_welcome">欢迎您,{% if user.nick_name %}{{ user.nick_name }}{% else %}{{ user.username }}{% endif %}</div>
                    <a href="{% url 'logout' %}"><div class="user_quit">Quit</div></a>
                    <div class="fl"><a href="{% url 'users:info' %}"><img class="if_user_auth_img" src="{{ user.image.url }}" alt=""></a></div>
                </div>
                {% else %}
                <div class="if_user_not_auth">
                    <div class="fl" style="width: 60px;height: 72px;"></div>
                    <a href="{% url 'register' %}"><div class="url_div_box_rl fl">注册</div></a>
                    <a href="{% url 'login' %}"><div class="url_div_box_rl fl">登陆</div></a>
                </div>
                {% endif %}
            </div>
        </div>
    </div>
</div>


<section>
        <div class="detail_main_head" style="background: url({% static 'images/tealist/456456.png' %});">
            <div class="wp">
                <div class="top_daohang">
                    <ul>
                        {% block custom_bread %}
                        <li><a href="{% url 'index' %}">首页</a>&nbsp;>&nbsp;</li>
                        <li><a href="{% url 'users:info' %}">个人中心</a></li>
                        {% endblock %}
                    </ul>
                </div>
                <div class="main_title">
                    <h1>个人中心</h1>
                </div>
                <div class="desc_title">
                    <h3>用户名:&nbsp;{{ user.username }}</h3>
                </div>
            </div>
        </div>
        <div style="height: 20px;"></div>
</section>

<section style="min-height: 800px;">
    <div class="wp list personal_list">
        <div class="left">
            <ul>
                <li class="{% if current_page == 'info' %}active2{% endif %}"><a href="{% url 'users:info' %}">个人资料</a>
                </li>
                <li class="{% if current_page == 'mycourse' %}active2{% endif %}"><a href="{% url 'users:mycourse' %}">我的课程</a>
                </li>
                 <li class="{% if current_page == 'myfav_course' %}active2{% endif %}">
                    <a href="{% url 'users:myfav_course' %}">收藏课程</a></li>
                 <li class="{% if current_page == 'myfav_teacher' %}active2{% endif %}">
                    <a href="{% url 'users:myfav_teacher' %}">收藏教师</a></li>
                <li class="{% if current_page == 'message' %}active2{% endif %}">
                    <a href="{% url 'users:messages' %}" style="position: relative;">
                        我的消息
                    </a>
                </li>
                <li class="{% if current_page == 'myorder' %}active2{% endif %}">
                    <a href="{% url 'users:myorder' %}" style="position: relative;">
                        我的订单
                    </a>
                </li>
            </ul>
        </div>

        {% block right_form %}
            <div class="right">
                <div class="personal_des ">
                    <div class="head" style="border:1px solid #eaeaea;">
                        <h1>个人信息</h1>
                    </div>
                    <div class="inforcon">

                        <div class="left" style="width:242px;">
                            <iframe id='frameFile' name='frameFile' style='display: none;'></iframe>
                            <form class="clearfix" id="jsAvatarForm" enctype="multipart/form-data" autocomplete="off"
                                  method="post" action="/users/image/upload/" target='frameFile'>
                                <label class="changearea" for="avatarUp">
                            <span id="avatardiv" class="pic">
                                <img width="100" height="100" class="js-img-show" id="avatarShow"
                                     src="../media/image/2016/12/default_big_14.png"/>
                            </span>
                                    <span class="fl upload-inp-box" style="margin-left:70px;">
                                <span class="button btn-green btn-w100" id="jsAvatarBtn">修改头像</span>
                                <input type="file" name="image" id="avatarUp" class="js-img-up"/>
                            </span>
                                </label>
                            </form>
                            <div style="border-top:1px solid #eaeaea;margin-top:30px;">
                                <a class="button btn-green btn-w100" id="jsUserResetPwd"
                                   style="margin:80px auto;width:100px;">修改密码</a>
                            </div>
                        </div>

                        <form class="perinform" id="jsEditUserForm" autocomplete="off">
                            <ul class="right">
                                <li>昵&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;称：
                                    <input type="text" name="nick_name" id="nick_name" value="django" maxlength="10">
                                    <i class="error-tips"></i>
                                </li>
                                <li>生&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;日：
                                    <input type="text" id="birth_day" name="birday" value="2009年9月2日"
                                           readonly="readonly"/>
                                    <i class="error-tips"></i>
                                </li>
                                <li>性&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;别：
                                    <label>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="radio" name="gender" value="male">男</label>
                                    <label>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="radio" name="gender"
                                                                                      value="female" checked="checked">女</label>
                                </li>
                                <li class="p_infor_city">地&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;址：
                                    <input type="text" name="address" id="address" placeholder="请输入你的地址" value="我来自火星"
                                           maxlength="10">
                                    <i class="error-tips"></i>
                                </li>
                                <li>手&nbsp;&nbsp;机&nbsp;&nbsp;号：
                                    <input class="borderno" type="text" name="mobile" readonly="readonly" value="">
                                    <span class="changeemai_btn green changephone-color">[修改]</span>
                                </li>
                                <li class="button heibtn">
                                    <input type="button" id="jsEditUserBtn" value="保存">
                                </li>
                            </ul>
                        </form>

                    </div>
                </div>
            </div>
        {% endblock %}

    </div>
</section>





<!--header start-->

<div class="dialog" id="jsDialog">
    <div class="successbox dialogbox" id="jsSuccessTips">
        <h1>成功提交</h1>
        <div class="close jsCloseDialog"><img src="{% static 'images/dig_close.png' %}"/></div>
        <div class="cont">
            <h2>您的需求提交成功！</h2>
            <p></p>
        </div>
    </div>
    <!--提示弹出框-->
    <div class="bidtips dialogbox promptbox" id="jsComfirmDialig">
        <h1>确认提交</h1>
        <div class="close jsCloseDialog"><img src="{% static 'images/dig_close.png' %}"/></div>
        <div class="cont">
            <h2>您确认提交吗？</h2>
            <dd class="autoTxtCount">
                <div class="button">
                    <input type="button" class="fl half-btn" value="确定" id="jsComfirmBtn"/>
                    <span class="fr half-btn jsCloseDialog">取消</span>
                </div>
            </dd>
        </div>
    </div>
    <div class="resetpwdbox dialogbox" id="jsResetDialog">
        <h1>修改密码</h1>
        <div class="close jsCloseDialog"><img src="{% static 'images/dig_close.png' %}"/></div>
        <div class="cont">
            <form id="jsResetPwdForm" autocomplete="off">
                <div class="box">
                    <span class="word2">新&nbsp;&nbsp;密&nbsp;&nbsp;码</span>
                    <input type="password" id="pwd" name="password1" placeholder="6-20位非中文字符"/>
                </div>
                <div class="box">
                    <span class="word2">确定密码</span>
                    <input type="password" id="repwd" name="password2" placeholder="6-20位非中文字符"/>
                </div>
                <div class="error btns" id="jsResetPwdTips"></div>
                <div class="button">
                    <input id="jsResetPwdBtn" type="button" value="提交"/>
                </div>
                {% csrf_token %}
            </form>
        </div>
    </div>

    <!--手机修改-->
    <div class="dialogbox changephone changephone1" id="jsChangePhoneDialog" style="display: none; margin-top: 81px;">
        <h1>修改手机号码</h1>
        <div class="close jsCloseDialog"><img src="{% static 'images/dig_close.png' %}"></div>
        <p>请输入新的手机号码</p>
        <form id="jsChangePhoneForm" autocomplete="off">
            <div class="box">
                <input class="fl change_mobile" type="text" id="jsChangePhone" name="mobile" autocomplete="off"
                       placeholder="输入重新绑定的手机号码">
            </div>
            <div class="box">
                {{ captcha_form.captcha }}
            </div>
            <div class="box">
                <input class="fl" type="text" id="jsChangePhoneCode" name="code" placeholder="输入手机验证码">
                <input class="getcode getting" type="button" id="jsChangePhoneCodeBtn" value="获取验证码">
            </div>
            <div class="error btns" id="jsChangePhoneTips" style="display: none;"></div>
            <div class="button">
                <input type="button" value="完成" id="jsChangePhoneBtn">
            </div>
            {% csrf_token %}
        </form>
    </div>
    <div class="resetpassbox dialogbox" id="jsSetNewPwd">
        <h1>重新设置密码</h1>
        <div class="close jsCloseDialog"><img src="{% static 'images/dig_close.png' %}"/></div>
        <p class="green">请输入新密码</p>
        <form id="jsSetNewPwdForm">
            <div class="box">
                <span class="word2">密&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;码</span>
                <input type="password" name="password" id="jsResetPwd" placeholder="请输入新密码"/>
            </div>
            <div class="box">
                <span class="word2">确&nbsp;认&nbsp;密&nbsp;码</span>
                <input type="password" name="password2" id="jsResetPwd2" placeholder="请再次输入新密码"/>
            </div>
            <div class="box">
                <span class="word2">验&nbsp;&nbsp;证&nbsp;&nbsp;码</span>
                <input type="text" name="code" id="jsResetCode" placeholder="请输入手机验证码"/>
            </div>
            <div class="error btns" id="jsSetNewPwdTips"></div>
            <div class="button">
                <input type="hidden" name="mobile" id="jsInpResetMobil"/>
                <input id="jsSetNewPwdBtn" type="button" value="提交"/>
            </div>
        </form>
    </div>
    <div class="forgetbox dialogbox">
        <h1>忘记密码</h1>
        <div class="close jsCloseDialog"><img src="{% static 'images/dig_close.png' %}"/></div>
        <div class="cont">
            <form id="jsFindPwdForm" autocomplete="off">
                <div class="box">
                    <span class="word2">账&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;号</span>
                    <input type="text" id="account" name="account" placeholder="手机/邮箱"/>
                </div>
                <div class="box">
                    <span class="word3">验证码</span>
                    <input autocomplete="off" class="form-control-captcha find-password-captcha"
                           id="find-password-captcha_1" name="captcha_f_1" placeholder="请输入验证码" type="text"/> <input
                        class="form-control-captcha find-password-captcha" id="find-password-captcha_0"
                        name="captcha_f_0" placeholder="请输入验证码" type="hidden"
                        value="5f3c00e47fb1be12d2fd15b9a860711597721b3f"/> &nbsp;<img
                        src="/captcha/image/5f3c00e47fb1be12d2fd15b9a860711597721b3f/" alt="captcha" class="captcha"/>
                </div>
                <div class="error btns" id="jsForgetTips"></div><!--忘记密码错误-->
                <div class="button">
                    <input type="hidden" name="sms_type" value="1">
                    <input id="jsFindPwdBtn" type="button" value="提交"/>
                </div>
            </form>
        </div>
    </div>
</div>
<div class="bg" id="dialogBg"></div>

{#日期控件#}
<script type="text/javascript" src="{% static 'js/plugins/laydate/laydate.js' %}"></script>
<script src="{% static 'js/plugins/layer/layer.js' %}"></script>
{#日期控件#}
<script src="{% static 'js/plugins/jquery.scrollLoading.js' %}" type="text/javascript"></script>
<script src="{% static 'js/jquery/deco-common.js' %}" type="text/javascript"></script>
<script src="{% static 'js/deco-user.js' %}"></script>
<script src='{% static 'js/plugins/jquery.upload.js' %}' type='text/javascript'></script>
<script src="{% static 'js/jquery/validate.js' %}" type="text/javascript"></script>
<script src="{% static 'js/jquery/validateDialog.js' %}" type="text/javascript"></script>




{% block custom_js %}
{% endblock %}
</body>
</html>
